// Slideshow Variables (legacy hero-slideshow)
let currentSlideIndex = 0;
let slideshowInterval;
let isPlaying = true;
const legacySlideshowRoot = document.querySelector('.hero-slideshow');
const slides = legacySlideshowRoot ? legacySlideshowRoot.querySelectorAll('.slide') : [];
const indicators = legacySlideshowRoot ? legacySlideshowRoot.querySelectorAll('.indicator') : [];
const playPauseBtn = legacySlideshowRoot ? legacySlideshowRoot.querySelector('.play-pause-btn') : null;
const totalSlides = slides.length;

// Initialize legacy slideshow only when old markup exists
document.addEventListener('DOMContentLoaded', function() {
    if (!legacySlideshowRoot || totalSlides < 1) {
        return;
    }
    showSlide(0);
    startSlideshow();
});

// Slideshow Functions
function showSlide(index) {
    if (!legacySlideshowRoot || totalSlides < 1) {
        return;
    }
    // Hide all slides
    slides.forEach(slide => slide.classList.remove('active'));
    indicators.forEach(indicator => indicator.classList.remove('active'));
    
    // Show current slide
    if (slides[index]) {
        slides[index].classList.add('active');
    }
    if (indicators[index]) {
        indicators[index].classList.add('active');
    }
    
    currentSlideIndex = index;
}

function nextSlide() {
    const nextIndex = (currentSlideIndex + 1) % totalSlides;
    showSlide(nextIndex);
}

function prevSlide() {
    const prevIndex = (currentSlideIndex - 1 + totalSlides) % totalSlides;
    showSlide(prevIndex);
}

function changeSlide(direction) {
    if (direction === 1) {
        nextSlide();
    } else {
        prevSlide();
    }
    // Restart slideshow after manual navigation
    if (isPlaying) {
        clearInterval(slideshowInterval);
        startSlideshow();
    }
}

function currentSlide(index) {
    showSlide(index - 1);
    // Restart slideshow after manual navigation
    if (isPlaying) {
        clearInterval(slideshowInterval);
        startSlideshow();
    }
}

function startSlideshow() {
    if (isPlaying) {
        slideshowInterval = setInterval(nextSlide, 5000); // Change slide every 5 seconds
    }
}

function stopSlideshow() {
    clearInterval(slideshowInterval);
}

function toggleSlideshow() {
    if (!playPauseBtn) {
        return;
    }
    isPlaying = !isPlaying;
    const icon = playPauseBtn.querySelector('i');
    
    if (isPlaying) {
        icon.className = 'fas fa-pause';
        startSlideshow();
    } else {
        icon.className = 'fas fa-play';
        stopSlideshow();
    }
}

// Keyboard navigation (legacy slideshow)
document.addEventListener('keydown', function(e) {
    if (!legacySlideshowRoot) {
        return;
    }
    if (e.key === 'ArrowLeft') {
        prevSlide();
        if (isPlaying) {
            clearInterval(slideshowInterval);
            startSlideshow();
        }
    } else if (e.key === 'ArrowRight') {
        nextSlide();
        if (isPlaying) {
            clearInterval(slideshowInterval);
            startSlideshow();
        }
    } else if (e.key === ' ') {
        e.preventDefault();
        toggleSlideshow();
    }
});

// Touch/Swipe support for mobile
let touchStartX = 0;
let touchEndX = 0;

document.addEventListener('touchstart', function(e) {
    touchStartX = e.changedTouches[0].screenX;
});

document.addEventListener('touchend', function(e) {
    touchEndX = e.changedTouches[0].screenX;
    handleSwipe();
});

function handleSwipe() {
    if (!legacySlideshowRoot) {
        return;
    }
    const swipeThreshold = 50;
    const diff = touchStartX - touchEndX;
    
    if (Math.abs(diff) > swipeThreshold) {
        if (diff > 0) {
            // Swipe left - next slide
            nextSlide();
        } else {
            // Swipe right - previous slide
            prevSlide();
        }
        // Restart slideshow after swipe
        if (isPlaying) {
            clearInterval(slideshowInterval);
            startSlideshow();
        }
    }
}

// Pause slideshow on hover
const slideshowContainer = document.querySelector('.slideshow-container');
if (slideshowContainer) {
    slideshowContainer.addEventListener('mouseenter', function() {
        if (isPlaying) {
            stopSlideshow();
            const icon = playPauseBtn.querySelector('i');
            icon.className = 'fas fa-play';
        }
    });
    
    slideshowContainer.addEventListener('mouseleave', function() {
        if (isPlaying) {
            startSlideshow();
            const icon = playPauseBtn.querySelector('i');
            icon.className = 'fas fa-pause';
        }
    });
}

// Mobile Navigation Toggle
const hamburger = document.querySelector('.hamburger');
const navMenu = document.querySelector('.nav-menu');

if (hamburger && navMenu) {
    hamburger.addEventListener('click', () => {
        hamburger.classList.toggle('active');
        navMenu.classList.toggle('active');
    });

    // Close mobile menu when clicking on a link
    document.querySelectorAll('.nav-link').forEach(n => n.addEventListener('click', () => {
        hamburger.classList.remove('active');
        navMenu.classList.remove('active');
    }));

    // Close mobile menu when clicking outside
    document.addEventListener('click', (e) => {
        if (!hamburger.contains(e.target) && !navMenu.contains(e.target)) {
            hamburger.classList.remove('active');
            navMenu.classList.remove('active');
        }
    });
}

// Smooth scrolling for navigation links (with validation to avoid querySelector errors)
// DISABLED for href="#" links completely
document.addEventListener('DOMContentLoaded', function() {
    // Get all links
    const allLinks = document.querySelectorAll('a');
    
    allLinks.forEach(anchor => {
        let href = anchor.getAttribute('href');
        
        // Skip if no href
        if (!href) {
            return;
        }
        
        // Normalize href
        href = String(href).trim();
        
        // CRITICAL: Skip if href doesn't start with #
        if (!href.startsWith('#')) {
            return;
        }
        
        // CRITICAL: Skip links with href="#" - these cause querySelector SyntaxError
        // This validation MUST happen and skip BEFORE any querySelector call
        if (href === '#' || href.length < 2) {
            // Completely skip this anchor - don't add event listener at all
            return;
        }
        
        // Extract selector part (after #)
        const selectorPart = href.substring(1);
        
        // CRITICAL: Skip if selector is empty
        if (!selectorPart || selectorPart.trim() === '' || selectorPart.length === 0) {
            return; // Skip this anchor
        }
        
        // At this point, href is guaranteed to be "#X" where X is non-empty
        // Store it in a constant to prevent any changes
        const validatedHref = href;
        
        // Only add event listener for validated hrefs
        anchor.addEventListener('click', function (e) {
            // Use the validated href from closure (never re-read from attribute)
            // This ensures we never call querySelector with "#"
            
            // Final safety check
            if (!validatedHref || validatedHref === '#' || validatedHref.length < 2) {
                return; // Should never reach here, but safety first
            }
            
            try {
                // validatedHref is guaranteed to be "#something" not "#"
                const targetElement = document.querySelector(validatedHref);
                
                if (targetElement) {
                    e.preventDefault();
                    targetElement.scrollIntoView({
                        behavior: 'smooth',
                        block: 'start'
                    });
                }
                // If element doesn't exist, let browser handle (no preventDefault)
            } catch (error) {
                // Should never happen, but if it does, log and let browser handle
                console.error('Smooth scroll error (should not happen):', validatedHref, error);
            }
        });
    });
});

// Navbar background change on scroll
window.addEventListener('scroll', () => {
    const navbar = document.querySelector('.navbar');
    if (window.scrollY > 50) {
        navbar.classList.add('scrolled');
    } else {
        navbar.classList.remove('scrolled');
    }
}, { passive: true });

// Form submission
const contactForm = document.querySelector('.contact-form form');
if (contactForm) {
    contactForm.addEventListener('submit', function(e) {
        e.preventDefault();
        
        // Get form data
        const formData = new FormData(this);
        const name = this.querySelector('input[type="text"]').value;
        const email = this.querySelector('input[type="email"]').value;
        const phone = this.querySelector('input[type="tel"]').value;
        const message = this.querySelector('textarea').value;
        
        // Simple validation
        if (!name || !email || !message) {
            alert('Mohon lengkapi semua field yang wajib diisi.');
            return;
        }
        
        // Email validation
        const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
        if (!emailRegex.test(email)) {
            alert('Mohon masukkan alamat email yang valid.');
            return;
        }
        
        // Simulate form submission
        const submitBtn = this.querySelector('button[type="submit"]');
        const originalText = submitBtn.textContent;
        
        submitBtn.textContent = 'Mengirim...';
        submitBtn.disabled = true;
        
        setTimeout(() => {
            alert('Terima kasih! Pesan Anda telah berhasil dikirim. Kami akan menghubungi Anda segera.');
            this.reset();
            submitBtn.textContent = originalText;
            submitBtn.disabled = false;
        }, 2000);
    });
}

// Enhanced Intersection Observer for animations
const observerOptions = {
    threshold: 0.1,
    rootMargin: '0px 0px -50px 0px'
};

const observer = new IntersectionObserver((entries) => {
    entries.forEach(entry => {
        if (entry.isIntersecting) {
            entry.target.classList.add('animated');
        }
    });
}, observerOptions);

// Observe elements for animation
document.addEventListener('DOMContentLoaded', () => {
    // Add animation classes to elements
    const animatedElements = document.querySelectorAll('.product-card, .feature, .catalog-feature, .vision-card, .mission-card, .about-text, .about-feature-card, .about-image, .contact-item');
    
    animatedElements.forEach((el, index) => {
        el.classList.add('animate-on-scroll');
        el.style.transitionDelay = `${index * 0.1}s`;
        observer.observe(el);
    });

    // Add specific animations to vision and mission cards
    const visionCard = document.querySelector('.vision-card');
    const missionCard = document.querySelector('.mission-card');
    
    if (visionCard) {
        visionCard.classList.remove('animate-on-scroll');
        visionCard.classList.add('animate-left');
        observer.observe(visionCard);
    }
    
    if (missionCard) {
        missionCard.classList.remove('animate-on-scroll');
        missionCard.classList.add('animate-right');
        observer.observe(missionCard);
    }

    // Add scale animation to about image
    const aboutImage = document.querySelector('.about-image');
    if (aboutImage) {
        aboutImage.classList.remove('animate-on-scroll');
        aboutImage.classList.add('animate-scale');
        observer.observe(aboutImage);
    }
});

// Product card hover effects
document.querySelectorAll('.product-card').forEach(card => {
    card.addEventListener('mouseenter', function() {
        this.style.transform = 'translateY(-10px) scale(1.02)';
    });
    
    card.addEventListener('mouseleave', function() {
        this.style.transform = 'translateY(0) scale(1)';
    });
});

// Button click effects
document.querySelectorAll('.btn').forEach(btn => {
    btn.addEventListener('click', function(e) {
        // Create ripple effect
        const ripple = document.createElement('span');
        const rect = this.getBoundingClientRect();
        const size = Math.max(rect.width, rect.height);
        const x = e.clientX - rect.left - size / 2;
        const y = e.clientY - rect.top - size / 2;
        
        ripple.style.width = ripple.style.height = size + 'px';
        ripple.style.left = x + 'px';
        ripple.style.top = y + 'px';
        ripple.classList.add('ripple');
        
        this.appendChild(ripple);
        
        setTimeout(() => {
            ripple.remove();
        }, 600);
    });
});

// Add ripple effect styles
const style = document.createElement('style');
style.textContent = `
    .btn {
        position: relative;
        overflow: hidden;
    }
    
    .ripple {
        position: absolute;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.3);
        transform: scale(0);
        animation: ripple-animation 0.6s linear;
        pointer-events: none;
    }
    
    @keyframes ripple-animation {
        to {
            transform: scale(4);
            opacity: 0;
        }
    }
`;
document.head.appendChild(style);

// Lazy loading for images (if any are added later)
const lazyImages = document.querySelectorAll('img[data-src]');
const imageObserver = new IntersectionObserver((entries, observer) => {
    entries.forEach(entry => {
        if (entry.isIntersecting) {
            const img = entry.target;
            img.src = img.dataset.src;
            img.classList.remove('lazy');
            imageObserver.unobserve(img);
        }
    });
});

lazyImages.forEach(img => imageObserver.observe(img));

// Scroll to top functionality
const scrollToTopBtn = document.createElement('button');
scrollToTopBtn.innerHTML = '<i class="fas fa-arrow-up"></i>';
scrollToTopBtn.className = 'scroll-to-top';
scrollToTopBtn.style.cssText = `
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #dc2626;
    color: white;
    border: none;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3);
    transition: all 0.3s ease;
    z-index: 1000;
`;

document.body.appendChild(scrollToTopBtn);

window.addEventListener('scroll', () => {
    if (window.scrollY > 300) {
        scrollToTopBtn.style.display = 'flex';
    } else {
        scrollToTopBtn.style.display = 'none';
    }
});

scrollToTopBtn.addEventListener('click', () => {
    window.scrollTo({
        top: 0,
        behavior: 'smooth'
    });
});

// Add hover effect to scroll to top button
scrollToTopBtn.addEventListener('mouseenter', function() {
    this.style.transform = 'scale(1.1)';
    this.style.background = '#b91c1c';
});

scrollToTopBtn.addEventListener('mouseleave', function() {
    this.style.transform = 'scale(1)';
    this.style.background = '#dc2626';
});

// Pagination Variables
let currentPage = 1;
const productsPerPage = 8;
let filteredProducts = [];

// Product Catalog Data
//const productCatalog = [
//    {
//        id: 'obh-nellco-1',
//        name: 'OBH Nellco Sirup',
//        subtitle: 'Obat batuk herbal untuk dewasa dan anak-anak',
//        type: 'obat-batuk',
//        category: 'dewasa',
//        code: 'OBH-001',
//        weight: '100ml',
//        location: 'jakarta',
//        icon: 'fas fa-lungs',
//        color: '#667eea',
//        hasImage: true
//    },
//    {
//        id: 'batuk-anak-1',
//        name: 'Batukin Anak Sirup',
//        subtitle: 'Obat batuk herbal untuk anak-anak',
//        type: 'obat-batuk',
//        category: 'anak',
//        code: 'BAT-001',
//        weight: '100ml',
//        location: 'jakarta',
//        icon: 'fas fa-lungs',
//        color: '#667eea'
//    },
//    {
//        id: 'batuk-dewasa-1',
//        name: 'Batukin Dewasa Kapsul',
//        subtitle: 'Obat batuk untuk dewasa dengan formula herbal',
//        type: 'obat-batuk',
//        category: 'dewasa',
//        code: 'BAT-002',
//        weight: '30 kapsul',
//        location: 'surabaya',
//        icon: 'fas fa-lungs',
//        color: '#667eea'
//    },
//    {
//        id: 'vitamin-c-1',
//        name: 'Vitacell C-1000',
//        subtitle: 'Suplemen vitamin C tinggi untuk daya tahan tubuh',
//        type: 'vitamin',
//        category: 'dewasa',
//        code: 'VIT-001',
//        weight: '60 kapsul',
//        location: 'surabaya',
//        icon: 'fas fa-pills',
//        color: '#28a745',
//        hasImage: true
//    },
//    {
//        id: 'vitamin-anak-1',
//        name: 'Vitakids Multivitamin',
//        subtitle: 'Multivitamin lengkap untuk pertumbuhan anak',
//        type: 'vitamin',
//        category: 'anak',
//        code: 'VIT-002',
//        weight: '30 tablet',
//        location: 'bandung',
//        icon: 'fas fa-pills',
//        color: '#28a745'
//    },
//    {
//        id: 'bedak-bayi-1',
//        name: 'Baby Powder Premium',
//        subtitle: 'Bedak bayi hypoallergenic dengan formula lembut',
//        type: 'bedak',
//        category: 'anak',
//        code: 'BED-001',
//        weight: '200g',
//        location: 'bandung',
//        icon: 'fas fa-spray-can',
//        color: '#ffc107',
//        hasImage: true
//    },
//    {
//        id: 'bedak-dewasa-1',
//        name: 'Talc Powder Fresh',
//        subtitle: 'Bedak talc untuk dewasa dengan wangi segar',
//        type: 'bedak',
//        category: 'dewasa',
//        code: 'BED-002',
//        weight: '150g',
//        location: 'medan',
//        icon: 'fas fa-spray-can',
//        color: '#ffc107'
//    },
//    {
//        id: 'balsem-otot-1',
//        name: 'Balsem Hangat Muscle Relief',
//        subtitle: 'Balsem penghangat untuk meredakan nyeri otot dan sendi',
//        type: 'balsem',
//        category: 'dewasa',
//        code: 'BAL-001',
//        weight: '50g',
//        location: 'medan',
//        icon: 'fas fa-hand-holding-heart',
//        color: '#dc3545',
//        hasImage: true
//    },
//    {
//        id: 'balsem-anak-1',
//        name: 'Balsem Anak Gentle',
//        subtitle: 'Balsem lembut khusus untuk anak-anak',
//        type: 'balsem',
//        category: 'anak',
//        code: 'BAL-002',
//        weight: '30g',
//        location: 'semarang',
//        icon: 'fas fa-hand-holding-heart',
//        color: '#dc3545'
//    },
//    {
//        id: 'vitamin-lansia-1',
//        name: 'Senior Care Complete',
//        subtitle: 'Suplemen lengkap untuk kesehatan lansia',
//        type: 'vitamin',
//        category: 'lansia',
//        code: 'VIT-003',
//        weight: '90 kapsul',
//        location: 'jakarta',
//        icon: 'fas fa-pills',
//        color: '#28a745'
//    },
//    {
//        id: 'vitamin-ibu-hamil-1',
//        name: 'Prenatal Plus',
//        subtitle: 'Multivitamin khusus untuk ibu hamil dan menyusui',
//        type: 'vitamin',
//        category: 'ibu-hamil',
//        code: 'VIT-004',
//        weight: '60 tablet',
//        location: 'surabaya',
//        icon: 'fas fa-pills',
//        color: '#28a745'
//    },
//    {
//        id: 'batuk-lansia-1',
//        name: 'Cough Relief Senior',
//        subtitle: 'Obat batuk khusus untuk lansia',
//        type: 'obat-batuk',
//        category: 'lansia',
//        code: 'BAT-003',
//        weight: '120ml',
//        location: 'bandung',
//        icon: 'fas fa-lungs',
//        color: '#667eea'
//    },
//    {
//        id: 'bedak-ibu-hamil-1',
//        name: 'Mama Powder Safe',
//        subtitle: 'Bedak aman untuk ibu hamil',
//        type: 'bedak',
//        category: 'ibu-hamil',
//        code: 'BED-003',
//        weight: '100g',
//        location: 'medan',
//        icon: 'fas fa-spray-can',
//        color: '#ffc107'
//    }
//];

// Initialize catalog when page loads
document.addEventListener('DOMContentLoaded', function() {
    if (document.getElementById('productGrid')) {
        if (prdcSelected === '') {
            filteredProducts = [...productCatalog];
            loadProducts();
            updatePagination();
        }
        
        // Add error handling for images
        handleImageErrors();
    }
});

// Handle image loading errors
function handleImageErrors() {
    const productCards = document.querySelectorAll('.product-card-image.obh-nellco');
    productCards.forEach(card => {
        // Check if image loads successfully
        const img = new Image();
        img.onload = function() {
            // Image loaded successfully, remove fallback text
            card.style.backgroundImage = 'url(obh-nellco.jpg)';
            card.classList.add('image-loaded');
        };
        img.onerror = function() {
            // Image failed to load, show fallback
            card.style.backgroundImage = 'linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%)';
            card.style.backgroundSize = 'cover';
            card.classList.remove('image-loaded');
        };
        img.src = 'obh-nellco.jpg';
    });
}

// Load products into catalog with pagination
function loadProducts(productsToShow = filteredProducts) {
    const productGrid = document.getElementById('productGrid');
    const noResults = document.getElementById('noResults');
    const paginationContainer = document.getElementById('paginationContainer');
    
    if (productsToShow.length === 0) {
        productGrid.innerHTML = '';
        noResults.style.display = 'block';
        paginationContainer.style.display = 'none';
        return;
    }
    
    noResults.style.display = 'none';
    paginationContainer.style.display = 'flex';
    console.log(productsToShow.length);
    // Calculate pagination
    const totalPages = Math.ceil(productsToShow.length / productsPerPage);
    const startIndex = (currentPage - 1) * productsPerPage;
    const endIndex = startIndex + productsPerPage;
    const productsToDisplay = productsToShow.slice(startIndex, endIndex);
    
    productGrid.innerHTML = productsToDisplay.map(product => `
        <div class="product-card-wrapper" onclick="openProductDetail('${product.id}')">
            <div class="product-card-catalog">
                <div class="product-card-image" style="background-image: ${product.hasImage ? product.image : (product.type === 'obat-batuk' ? '' : `linear-gradient(135deg, ${product.color} 0%, ${product.color}dd 100%)`)};">
                    ${product.hasImage ? '' : (product.type === 'obat-batuk' ? `
                        <div class="medicine-bottle">
                            <div class="medicine-label"></div>
                        </div>
                        <div class="medicine-spoon"></div>
                    ` : `<i class="${product.icon}"></i>`)}
                    <!--div class="product-card-badges">
                        <div class="product-badge">${getTypeName(product.type)}</div>
                    </div--!>
                    <!--div class="product-name-overlay">${product.name}</div--!>
                </div>
            </div>
            <div class="product-info">
                <div class="product-title">${product.name}</div>
            </div>
        </div>
       
    `).join('');
    
    // Update pagination info
    updatePaginationInfo(productsToShow.length, startIndex + 1, Math.min(endIndex, productsToShow.length));
    
    // Handle image errors after products are loaded
    setTimeout(() => {
        handleImageErrors();
    }, 100);
}

// Filter products based on search and filters
function filterProducts() {
    const searchTerm = document.getElementById('productSearch').value.toLowerCase();
    const typeFilter = document.getElementById('typeFilter').value;
    const locationFilter = document.getElementById('locationFilter').value;
    const categoryFilter = document.getElementById('categoryFilter').value;
    
    filteredProducts = productCatalog.filter(product => {
        const matchesSearch = product.name.toLowerCase().includes(searchTerm) || 
                            product.subtitle.toLowerCase().includes(searchTerm) ||
                            product.code.toLowerCase().includes(searchTerm);
        const matchesType = !typeFilter || product.type === typeFilter;
        const matchesLocation = !locationFilter || product.location === locationFilter;
        const matchesCategory = !categoryFilter || product.category === categoryFilter;
        return matchesSearch && matchesType && matchesLocation && matchesCategory;
    });
    currentPage = 1; // Reset to first page when filtering
    loadProducts();
    updatePagination();
}

// Clear all filters
function clearFilters() {
    document.getElementById('productSearch').value = '';
    document.getElementById('typeFilter').value = '';
    document.getElementById('locationFilter').value = '';
    document.getElementById('categoryFilter').value = '';
    filteredProducts = [...productCatalog];
    currentPage = 1;
    loadProducts();
    updatePagination();
}

// Helper functions
function getTypeName(type) {
    const types = {
        'obat-batuk': 'Obat Batuk',
        'vitamin': 'Vitamin',
        'bedak': 'Bedak',
        'balsem': 'Balsem'
    };
    return types[type] || type;
}

function getCategoryName(category) {
    const categories = {
        'an': 'Anak-anak',
        'dw': 'Dewasa',
        'ls': 'Lansia',
        'ih': 'Ibu Hamil'
    };
    return categories[category] || category;
}

function getLocationName(location) {
    const locations = {
        'jakarta': 'Jakarta',
        'surabaya': 'Surabaya',
        'bandung': 'Bandung',
        'medan': 'Medan',
        'semarang': 'Semarang'
    };
    return locations[location] || location;
}

// Open product detail page
function openProductDetail(productId) {
//    window.open(`product-detail.html?id=${productId}`, '_blank');
//    window.open(baseUrl+"/detail/"+productId, '_blank');
//    window.location.replace(baseUrl+"/detail/"+productId);
    window.location.href = baseUrl + "/detail/" + productId;
}

// Request quote for specific product
function requestQuote(productId) {
    const product = productCatalog.find(p => p.id === productId);
    if (product) {
        const subject = `Permintaan Penawaran - ${product.name}`;
        const body = `Halo,\n\nSaya tertarik dengan produk ${product.name} (${product.code}) dan ingin meminta penawaran harga.\n\nTerima kasih.`;
        
        window.location.href = `mailto:info@nellcoindopharma.co.id?subject=${encodeURIComponent(subject)}&body=${encodeURIComponent(body)}`;
    }
}

// Pagination Functions
function updatePagination() {
    const totalPages = Math.ceil(filteredProducts.length / productsPerPage);
    const pagination = document.getElementById('pagination');
    
    if (totalPages <= 1) {
        pagination.innerHTML = '';
        return;
    }
    
    let paginationHTML = '';
    
    // Previous button
    paginationHTML += `
        <button class="pagination-btn ${currentPage === 1 ? 'disabled' : ''}" 
                onclick="goToPage(${currentPage - 1})" 
                ${currentPage === 1 ? 'disabled' : ''}>
            <i class="fas fa-chevron-left"></i>
        </button>
    `;
    
    // Page numbers
    const maxVisiblePages = 5;
    let startPage = Math.max(1, currentPage - Math.floor(maxVisiblePages / 2));
    let endPage = Math.min(totalPages, startPage + maxVisiblePages - 1);
    
    if (endPage - startPage + 1 < maxVisiblePages) {
        startPage = Math.max(1, endPage - maxVisiblePages + 1);
    }
    
    // First page and ellipsis
    if (startPage > 1) {
        paginationHTML += `<button class="pagination-btn" onclick="goToPage(1)">1</button>`;
        if (startPage > 2) {
            paginationHTML += `<span class="pagination-ellipsis">...</span>`;
        }
    }
    
    // Page numbers
    for (let i = startPage; i <= endPage; i++) {
        paginationHTML += `
            <button class="pagination-btn ${i === currentPage ? 'active' : ''}" 
                    onclick="goToPage(${i})">
                ${i}
            </button>
        `;
    }
    
    // Last page and ellipsis
    if (endPage < totalPages) {
        if (endPage < totalPages - 1) {
            paginationHTML += `<span class="pagination-ellipsis">...</span>`;
        }
        paginationHTML += `<button class="pagination-btn" onclick="goToPage(${totalPages})">${totalPages}</button>`;
    }
    
    // Next button
    paginationHTML += `
        <button class="pagination-btn ${currentPage === totalPages ? 'disabled' : ''}" 
                onclick="goToPage(${currentPage + 1})" 
                ${currentPage === totalPages ? 'disabled' : ''}>
            <i class="fas fa-chevron-right"></i>
        </button>
    `;
    
    pagination.innerHTML = paginationHTML;
}

function goToPage(page) {
    const totalPages = Math.ceil(filteredProducts.length / productsPerPage);
    if (page >= 1 && page <= totalPages) {
        currentPage = page;
        loadProducts();
        updatePagination();
        
        // Scroll to top of product grid
        document.getElementById('productGrid').scrollIntoView({ 
            behavior: 'smooth', 
            block: 'start' 
        });
    }
}

function updatePaginationInfo(totalProducts, startItem, endItem) {
    const paginationInfo = document.getElementById('paginationInfo');
    paginationInfo.textContent = `Menampilkan ${startItem}-${endItem} dari ${totalProducts} produk`;
}

// Gallery Data with descriptions
const galleryData = [
    {
        id: 1,
        title: 'Produk Farmasi',
        description: 'Koleksi produk unggulan PT Nellco Indopharma yang telah teruji kualitasnya. Produk-produk kami dirancang khusus untuk memberikan solusi kesehatan terbaik bagi keluarga Indonesia. Setiap produk telah melalui proses pengujian yang ketat untuk memastikan keamanan dan efektivitasnya.',
        category: 'kegiatan',
        gradient: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
        icon: 'fas fa-pills'
    },
    {
        id: 2,
        title: 'Gedung Perusahaan',
        description: 'Fasilitas modern dan terstandar yang menjadi pusat operasional PT Nellco Indopharma. Gedung ini dilengkapi dengan teknologi terbaru dan mengikuti standar internasional untuk memastikan kualitas produksi yang tinggi. Seluruh fasilitas dirancang untuk memberikan lingkungan kerja yang nyaman dan produktif bagi seluruh karyawan.',
        category: 'fasilitas',
        gradient: 'linear-gradient(135deg, #f093fb 0%, #f5576c 100%)',
        icon: 'fas fa-building'
    },
    {
        id: 3,
        title: 'Tim Perusahaan',
        description: 'Professional dan berpengalaman yang menjadi tulang punggung PT Nellco Indopharma. Tim kami terdiri dari para ahli di bidang farmasi, penelitian, dan manajemen yang berdedikasi untuk memberikan produk kesehatan berkualitas tinggi. Komitmen kami adalah melayani masyarakat dengan produk terbaik.',
        category: 'kegiatan',
        gradient: 'linear-gradient(135deg, #4facfe 0%, #00f2fe 100%)',
        icon: 'fas fa-users'
    },
    {
        id: 4,
        title: 'Laboratorium',
        description: 'Fasilitas pengujian kualitas produk yang dilengkapi dengan peralatan modern dan teknologi terkini. Laboratorium kami melakukan berbagai pengujian untuk memastikan setiap produk memenuhi standar kualitas internasional. Proses pengujian dilakukan secara ketat dan menyeluruh pada setiap tahap produksi.',
        category: 'fasilitas',
        gradient: 'linear-gradient(135deg, #43e97b 0%, #38f9d7 100%)',
        icon: 'fas fa-flask'
    },
    {
        id: 5,
        title: 'Acara Perusahaan',
        description: 'Moment penting perusahaan yang menandai berbagai pencapaian dan milestone PT Nellco Indopharma. Setiap acara merupakan kesempatan untuk memperkuat hubungan dengan mitra, konsumen, dan seluruh stakeholder. Kami berkomitmen untuk terus berkembang dan memberikan kontribusi positif bagi industri farmasi Indonesia.',
        category: 'event',
        gradient: 'linear-gradient(135deg, #fa709a 0%, #fee140 100%)',
        icon: 'fas fa-calendar-alt'
    },
    {
        id: 6,
        title: 'Pabrik Produksi',
        description: 'Fasilitas produksi modern yang menggunakan teknologi terbaru dalam proses pembuatan produk farmasi. Pabrik kami mengikuti standar Good Manufacturing Practice (GMP) dan telah mendapatkan sertifikasi internasional. Setiap produk yang dihasilkan melalui proses quality control yang ketat untuk memastikan kualitas terbaik.',
        category: 'fasilitas',
        gradient: 'linear-gradient(135deg, #30cfd0 0%, #330867 100%)',
        icon: 'fas fa-industry'
    },
    {
        id: 7,
        title: 'Kemitraan',
        description: 'Kerjasama strategis dengan berbagai pihak untuk memperluas jangkauan dan meningkatkan kualitas layanan. Kemitraan yang kami jalin meliputi kerja sama dengan rumah sakit, apotek, distributor, dan institusi kesehatan lainnya. Kami percaya bahwa kolaborasi yang baik akan membawa manfaat bagi semua pihak.',
        category: 'kegiatan',
        gradient: 'linear-gradient(135deg, #a8edea 0%, #fed6e3 100%)',
        icon: 'fas fa-handshake'
    },
    {
        id: 8,
        title: 'Penghargaan',
        description: 'Prestasi dan pencapaian yang telah diraih oleh PT Nellco Indopharma sebagai pengakuan atas kualitas produk dan layanan kami. Penghargaan ini merupakan bukti komitmen kami dalam menjaga standar kualitas tinggi dan memberikan nilai terbaik bagi konsumen. Kami terus berusaha untuk meningkatkan kualitas dan layanan kami.',
        category: 'event',
        gradient: 'linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%)',
        icon: 'fas fa-trophy'
    },
    {
        id: 9,
        title: 'Packaging',
        description: 'Desain kemasan produk yang menarik dan informatif, dirancang untuk melindungi produk dan memberikan informasi yang jelas kepada konsumen. Kemasan kami menggunakan bahan berkualitas tinggi yang aman dan ramah lingkungan. Setiap kemasan dirancang dengan memperhatikan aspek keamanan, kenyamanan, dan estetika.',
        category: 'kegiatan',
        gradient: 'linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%)',
        icon: 'fas fa-box'
    },
    {
        id: 10,
        title: 'Riset & Pengembangan',
        description: 'Aktivitas penelitian dan pengembangan produk baru yang dilakukan oleh tim riset berpengalaman. Kami terus berinovasi untuk mengembangkan formula baru yang lebih efektif dan aman. Riset dan pengembangan merupakan investasi jangka panjang untuk memberikan produk terbaik bagi konsumen.',
        category: 'kegiatan',
        gradient: 'linear-gradient(135deg, #ff6e7f 0%, #bfe9ff 100%)',
        icon: 'fas fa-microscope'
    },
    {
        id: 11,
        title: 'Gudang',
        description: 'Fasilitas penyimpanan yang dilengkapi dengan sistem kontrol suhu dan kelembaban untuk menjaga kualitas produk. Gudang kami dirancang mengikuti standar penyimpanan farmasi yang ketat. Setiap produk disimpan dalam kondisi yang optimal untuk memastikan kualitas tetap terjaga hingga sampai ke tangan konsumen.',
        category: 'fasilitas',
        gradient: 'linear-gradient(135deg, #c471ed 0%, #f64f59 100%)',
        icon: 'fas fa-warehouse'
    },
    {
        id: 12,
        title: 'Sertifikasi',
        description: 'Dokumentasi sertifikasi yang telah diperoleh PT Nellco Indopharma sebagai bukti komitmen kami dalam menjaga standar kualitas. Sertifikasi ini mencakup berbagai aspek mulai dari produksi, kualitas, hingga manajemen lingkungan. Kami terus berusaha untuk mempertahankan dan meningkatkan standar kualitas kami.',
        category: 'event',
        gradient: 'linear-gradient(135deg, #12c2e9 0%, #c471ed 100%)',
        icon: 'fas fa-certificate'
    }
];

// Gallery Filter Functionality
document.addEventListener('DOMContentLoaded', function() {
    const filterButtons = document.querySelectorAll('.filter-btn');
    const galleryItems = document.querySelectorAll('.gallery-item');

    if (filterButtons.length > 0 && galleryItems.length > 0) {
        filterButtons.forEach(button => {
            button.addEventListener('click', function() {
                // Remove active class from all buttons
                filterButtons.forEach(btn => btn.classList.remove('active'));
                // Add active class to clicked button
                this.classList.add('active');

                const filterValue = this.getAttribute('data-filter');

                // Filter gallery items
                galleryItems.forEach(item => {
                    const category = item.getAttribute('data-category');
                    
                    if (filterValue === 'all' || category === filterValue) {
                        item.classList.remove('hide');
                        // Add animation
                        item.style.opacity = '0';
                        item.style.transform = 'scale(0.8)';
                        setTimeout(() => {
                            item.style.transition = 'all 0.3s ease';
                            item.style.opacity = '1';
                            item.style.transform = 'scale(1)';
                        }, 10);
                    } else {
                        item.style.transition = 'all 0.3s ease';
                        item.style.opacity = '0';
                        item.style.transform = 'scale(0.8)';
                        setTimeout(() => {
                            item.classList.add('hide');
                        }, 300);
                    }
                });
            });
        });
    }

    // Gallery Modal/Lightbox Functionality
    const galleryModal = document.getElementById('galleryModal');
    const galleryModalImage = document.getElementById('galleryModalImage');
    const galleryModalTitle = document.getElementById('galleryModalTitle');
    const galleryModalDescription = document.getElementById('galleryModalDescription');
    const galleryModalClose = document.getElementById('galleryModalClose');
    const galleryModalPrev = document.getElementById('galleryModalPrev');
    const galleryModalNext = document.getElementById('galleryModalNext');
    const galleryModalOverlay = document.querySelector('.gallery-modal-overlay');

    let currentGalleryIndex = 0;
    let visibleGalleryItems = [];

    // Get visible gallery items based on current filter
    function getVisibleGalleryItems() {
        const filterValue = document.querySelector('.filter-btn.active')?.getAttribute('data-filter') || 'all';
        return galleryData.filter(item => filterValue === 'all' || item.category === filterValue);
    }

    // Open gallery modal
    function openGalleryModal(index) {
        visibleGalleryItems = getVisibleGalleryItems();
        currentGalleryIndex = index;
        updateGalleryModal();
        galleryModal.classList.add('active');
        document.body.style.overflow = 'hidden'; // Prevent body scroll
    }

    // Close gallery modal
    function closeGalleryModal() {
        galleryModal.classList.remove('active');
        document.body.style.overflow = ''; // Restore body scroll
    }

    // Update gallery modal content
    function updateGalleryModal() {
        if (visibleGalleryItems.length === 0) return;
        
        const currentItem = visibleGalleryItems[currentGalleryIndex];
        
        // Set image placeholder with gradient and icon
        const imageContainer = galleryModalImage.parentElement;
        imageContainer.style.background = currentItem.gradient;
        galleryModalImage.src = '';
        galleryModalImage.alt = currentItem.title;
        galleryModalImage.style.display = 'none'; // Hide image, show icon instead
        
        // Create or update icon element
        let iconElement = imageContainer.querySelector('.gallery-modal-icon');
        if (!iconElement) {
            iconElement = document.createElement('i');
            iconElement.className = 'gallery-modal-icon ' + currentItem.icon;
            imageContainer.appendChild(iconElement);
        } else {
            iconElement.className = 'gallery-modal-icon ' + currentItem.icon;
        }
        iconElement.style.display = 'flex';

        galleryModalTitle.textContent = currentItem.title;
        galleryModalDescription.textContent = currentItem.description;

        // Update navigation buttons
        galleryModalPrev.style.display = visibleGalleryItems.length > 1 ? 'flex' : 'none';
        galleryModalNext.style.display = visibleGalleryItems.length > 1 ? 'flex' : 'none';
    }

    // Navigate to previous image
    function prevImage() {
        if (visibleGalleryItems.length === 0) return;
        currentGalleryIndex = (currentGalleryIndex - 1 + visibleGalleryItems.length) % visibleGalleryItems.length;
        updateGalleryModal();
    }

    // Navigate to next image
    function nextImage() {
        if (visibleGalleryItems.length === 0) return;
        currentGalleryIndex = (currentGalleryIndex + 1) % visibleGalleryItems.length;
        updateGalleryModal();
    }

    // Add click event to gallery items
    galleryItems.forEach((item, index) => {
        const galleryItem = item;
        const galleryViewBtn = galleryItem.querySelector('.gallery-view-btn');
        const galleryImage = galleryItem.querySelector('.gallery-image');

        const clickHandler = (e) => {
            e.preventDefault();
            const filterValue = document.querySelector('.filter-btn.active')?.getAttribute('data-filter') || 'all';
            visibleGalleryItems = getVisibleGalleryItems();
            
            // Find the index of this item in the visible items
            const itemTitle = galleryItem.querySelector('.gallery-info h3')?.textContent || '';
            const itemData = galleryData.find(g => g.title === itemTitle);
            if (itemData) {
                const itemIndex = visibleGalleryItems.findIndex(g => g.id === itemData.id);
                if (itemIndex !== -1) {
                    openGalleryModal(itemIndex);
                }
            }
        };

        if (galleryViewBtn) {
            galleryViewBtn.addEventListener('click', clickHandler);
        }
        if (galleryImage) {
            galleryImage.addEventListener('click', clickHandler);
        }
    });

    // Close modal events
    if (galleryModalClose) {
        galleryModalClose.addEventListener('click', closeGalleryModal);
    }
    if (galleryModalOverlay) {
        galleryModalOverlay.addEventListener('click', closeGalleryModal);
    }

    // Navigation events
    if (galleryModalPrev) {
        galleryModalPrev.addEventListener('click', (e) => {
            e.stopPropagation();
            prevImage();
        });
    }
    if (galleryModalNext) {
        galleryModalNext.addEventListener('click', (e) => {
            e.stopPropagation();
            nextImage();
        });
    }

    // Keyboard navigation
    document.addEventListener('keydown', function(e) {
        if (galleryModal.classList.contains('active')) {
            if (e.key === 'Escape') {
                closeGalleryModal();
            } else if (e.key === 'ArrowLeft') {
                prevImage();
            } else if (e.key === 'ArrowRight') {
                nextImage();
            }
        }
    });
});

// News Data
const newsData = [
    {
        id: 1,
        slug: 'peluncuran-produk-baru-obh-nellco',
        title: 'Peluncuran Produk Baru OBH Nellco',
        category: 'produk',
        excerpt: 'PT Nellco Indopharma dengan bangga mengumumkan peluncuran produk terbaru OBH Nellco dengan formula yang telah ditingkatkan untuk memberikan efek yang lebih optimal dalam meredakan batuk.',
        content: 'PT Nellco Indopharma dengan bangga mengumumkan peluncuran produk terbaru OBH Nellco dengan formula yang telah ditingkatkan untuk memberikan efek yang lebih optimal dalam meredakan batuk. Produk baru ini dirancang khusus untuk memberikan kenyamanan maksimal bagi konsumen yang mengalami masalah batuk baik batuk kering maupun batuk berdahak. Formula yang telah diperbarui ini mengandung bahan-bahan alami yang telah teruji klinis untuk memberikan efek yang lebih cepat dan efektif dalam meredakan batuk. Produk OBH Nellco baru ini juga telah mendapatkan sertifikasi BPOM dan telah melalui berbagai uji kualitas untuk memastikan keamanan dan efektivitasnya.',
        featured_image: null,
        published_at: '2024-12-15',
        author: 'Admin'
    },
    {
        id: 2,
        slug: 'produk-mendapat-sertifikasi-bpom-terbaru',
        title: 'Produk Mendapat Sertifikasi BPOM Terbaru',
        category: 'perusahaan',
        excerpt: 'Semua produk PT Nellco Indopharma telah mendapatkan sertifikasi BPOM terbaru, memastikan kualitas dan keamanan produk yang kami tawarkan kepada konsumen.',
        content: 'Semua produk PT Nellco Indopharma telah mendapatkan sertifikasi BPOM terbaru, memastikan kualitas dan keamanan produk yang kami tawarkan kepada konsumen. Sertifikasi ini merupakan bukti komitmen kami dalam menjaga standar kualitas tertinggi dalam setiap produk yang kami produksi. Dengan sertifikasi BPOM terbaru ini, konsumen dapat merasa lebih percaya dan aman dalam menggunakan produk-produk Nellco. Kami terus berkomitmen untuk menghasilkan produk-produk kesehatan berkualitas tinggi yang dapat membantu meningkatkan kualitas hidup masyarakat Indonesia.',
        featured_image: null,
        published_at: '2024-12-10',
        author: 'Admin'
    },
    {
        id: 3,
        slug: 'tips-menjaga-kesehatan-di-musim-hujan',
        title: 'Tips Menjaga Kesehatan di Musim Hujan',
        category: 'kesehatan',
        excerpt: 'Musim hujan telah tiba, penting untuk menjaga kesehatan dengan mengonsumsi vitamin dan suplemen yang tepat. Pelajari tips menjaga daya tahan tubuh di musim hujan.',
        content: 'Musim hujan telah tiba, penting untuk menjaga kesehatan dengan mengonsumsi vitamin dan suplemen yang tepat. Pelajari tips menjaga daya tahan tubuh di musim hujan. Musim hujan membawa berbagai tantangan kesehatan, mulai dari flu, batuk, hingga berbagai penyakit lainnya. Untuk menjaga tubuh tetap sehat, ada beberapa tips yang dapat Anda terapkan: 1) Konsumsi vitamin C dan suplemen untuk meningkatkan daya tahan tubuh, 2) Pastikan tubuh tetap terhidrasi dengan minum air putih yang cukup, 3) Gunakan pakaian yang hangat dan selalu siap sedia payung atau jas hujan, 4) Jaga kebersihan lingkungan sekitar untuk mencegah berkembangnya nyamuk dan bakteri, 5) Istirahat yang cukup dan olahraga rutin untuk menjaga kebugaran tubuh.',
        featured_image: null,
        published_at: '2024-12-05',
        author: 'Admin'
    },
    {
        id: 4,
        slug: 'ekspansi-pabrik-baru-untuk-kapasitas-produksi',
        title: 'Ekspansi Pabrik Baru untuk Kapasitas Produksi',
        category: 'perusahaan',
        excerpt: 'PT Nellco Indopharma mengumumkan ekspansi pabrik baru untuk meningkatkan kapasitas produksi dan melayani lebih banyak konsumen dengan kualitas produk yang terjaga.',
        content: 'PT Nellco Indopharma mengumumkan ekspansi pabrik baru untuk meningkatkan kapasitas produksi dan melayani lebih banyak konsumen dengan kualitas produk yang terjaga. Ekspansi ini merupakan bagian dari rencana jangka panjang perusahaan untuk memperluas jangkauan pasar dan meningkatkan kualitas pelayanan kepada konsumen. Pabrik baru ini dilengkapi dengan teknologi terbaru dan standar produksi yang tinggi untuk memastikan setiap produk yang dihasilkan memenuhi standar kualitas internasional. Dengan ekspansi ini, PT Nellco Indopharma berharap dapat melayani lebih banyak konsumen di seluruh Indonesia dengan produk-produk kesehatan berkualitas tinggi.',
        featured_image: null,
        published_at: '2024-11-28',
        author: 'Admin'
    },
    {
        id: 5,
        slug: 'program-csr-kesehatan-untuk-masyarakat',
        title: 'Program CSR Kesehatan untuk Masyarakat',
        category: 'umum',
        excerpt: 'PT Nellco Indopharma menggelar program CSR kesehatan untuk masyarakat dengan memberikan edukasi tentang pentingnya menjaga kesehatan dan distribusi produk kesehatan gratis.',
        content: 'PT Nellco Indopharma menggelar program CSR kesehatan untuk masyarakat dengan memberikan edukasi tentang pentingnya menjaga kesehatan dan distribusi produk kesehatan gratis. Program ini merupakan bagian dari komitmen perusahaan untuk berkontribusi dalam meningkatkan kualitas kesehatan masyarakat Indonesia. Melalui program CSR ini, PT Nellco Indopharma memberikan edukasi tentang pentingnya menjaga kesehatan, pencegahan penyakit, dan cara hidup sehat. Selain itu, perusahaan juga mendistribusikan produk-produk kesehatan gratis kepada masyarakat yang membutuhkan, terutama di daerah-daerah yang kurang terjangkau layanan kesehatan. Program ini diharapkan dapat membantu meningkatkan kesadaran masyarakat tentang pentingnya menjaga kesehatan dan mencegah penyakit sejak dini.',
        featured_image: null,
        published_at: '2024-11-20',
        author: 'Admin'
    },
    {
        id: 6,
        slug: 'penelitian-terbaru-formula-produk',
        title: 'Penelitian Terbaru Formula Produk',
        category: 'produk',
        excerpt: 'Tim penelitian PT Nellco Indopharma telah menyelesaikan penelitian terbaru untuk meningkatkan efektivitas formula produk, dengan fokus pada keamanan dan kualitas.',
        content: 'Tim penelitian PT Nellco Indopharma telah menyelesaikan penelitian terbaru untuk meningkatkan efektivitas formula produk, dengan fokus pada keamanan dan kualitas. Penelitian ini dilakukan selama beberapa tahun dengan melibatkan tim ahli farmasi dan penelitian yang berpengalaman. Hasil penelitian menunjukkan bahwa formula baru yang dikembangkan memiliki efektivitas yang lebih tinggi dibandingkan dengan formula sebelumnya, dengan tetap menjaga tingkat keamanan yang tinggi. Formula baru ini telah melalui berbagai uji klinis dan telah terbukti aman dan efektif untuk digunakan. Dengan penelitian ini, PT Nellco Indopharma berharap dapat terus meningkatkan kualitas produk-produknya untuk memberikan manfaat yang lebih besar bagi konsumen.',
        featured_image: null,
        published_at: '2024-11-15',
        author: 'Admin'
    },
    {
        id: 7,
        slug: 'inovasi-teknologi-dalam-produksi-obat',
        title: 'Inovasi Teknologi dalam Produksi Obat',
        category: 'produk',
        excerpt: 'PT Nellco Indopharma mengadopsi teknologi terbaru dalam proses produksi untuk meningkatkan efisiensi dan kualitas produk obat.',
        content: 'PT Nellco Indopharma mengadopsi teknologi terbaru dalam proses produksi untuk meningkatkan efisiensi dan kualitas produk obat. Teknologi baru ini memungkinkan perusahaan untuk memproduksi obat dengan standar kualitas yang lebih tinggi, lebih cepat, dan lebih efisien. Dengan adopsi teknologi ini, perusahaan dapat memastikan bahwa setiap produk yang dihasilkan memenuhi standar kualitas internasional dan dapat memberikan manfaat yang optimal bagi konsumen. Inovasi teknologi ini juga memungkinkan perusahaan untuk mengurangi limbah produksi dan meningkatkan efisiensi penggunaan sumber daya.',
        featured_image: null,
        published_at: '2024-11-10',
        author: 'Admin'
    },
    {
        id: 8,
        slug: 'kerjasama-dengan-rumah-sakit-terkemuka',
        title: 'Kerjasama dengan Rumah Sakit Terkemuka',
        category: 'perusahaan',
        excerpt: 'PT Nellco Indopharma menandatangani kerjasama strategis dengan beberapa rumah sakit terkemuka di Indonesia untuk menyediakan produk kesehatan berkualitas.',
        content: 'PT Nellco Indopharma menandatangani kerjasama strategis dengan beberapa rumah sakit terkemuka di Indonesia untuk menyediakan produk kesehatan berkualitas. Kerjasama ini bertujuan untuk memastikan bahwa produk-produk Nellco dapat diakses oleh lebih banyak pasien yang membutuhkan. Melalui kerjasama ini, rumah sakit akan menggunakan produk-produk Nellco yang telah teruji kualitasnya untuk memberikan pelayanan kesehatan yang lebih baik kepada pasien. Kerjasama ini juga akan membantu PT Nellco Indopharma untuk terus meningkatkan kualitas produknya berdasarkan umpan balik dari para profesional kesehatan.',
        featured_image: null,
        published_at: '2024-11-05',
        author: 'Admin'
    },
    {
        id: 9,
        slug: 'penghargaan-kualitas-produk-internasional',
        title: 'Penghargaan Kualitas Produk Internasional',
        category: 'perusahaan',
        excerpt: 'PT Nellco Indopharma meraih penghargaan internasional untuk kualitas produk yang dihasilkan, mengakui komitmen perusahaan dalam menjaga standar kualitas tinggi.',
        content: 'PT Nellco Indopharma meraih penghargaan internasional untuk kualitas produk yang dihasilkan, mengakui komitmen perusahaan dalam menjaga standar kualitas tinggi. Penghargaan ini merupakan pengakuan atas dedikasi dan komitmen perusahaan dalam menghasilkan produk-produk kesehatan berkualitas tinggi yang dapat bersaing di pasar internasional. Dengan penghargaan ini, PT Nellco Indopharma semakin dipercaya sebagai perusahaan farmasi yang dapat diandalkan untuk menghasilkan produk-produk kesehatan berkualitas. Penghargaan ini juga akan menjadi motivasi bagi perusahaan untuk terus meningkatkan kualitas produk dan layanannya di masa depan.',
        featured_image: null,
        published_at: '2024-10-28',
        author: 'Admin'
    }
];

// News Functions
let currentNewsPage = 1;
const newsPerPage = 6;
let filteredNews = [...newsData];

// Load and display news
function loadNews() {
    const newsGrid = document.querySelector('.news-grid');
    const noResults = document.getElementById('noResults');
    const paginationContainer = document.getElementById('paginationContainer');
    
    if (!newsGrid) return;
    
    // Calculate pagination
    const totalPages = Math.ceil(filteredNews.length / newsPerPage);
    const startIndex = (currentNewsPage - 1) * newsPerPage;
    const endIndex = startIndex + newsPerPage;
    const newsToDisplay = filteredNews.slice(startIndex, endIndex);
    
    if (newsToDisplay.length === 0) {
        newsGrid.innerHTML = '';
        if (noResults) noResults.style.display = 'block';
        if (paginationContainer) paginationContainer.style.display = 'none';
        return;
    }
    
    if (noResults) noResults.style.display = 'none';
    if (paginationContainer) paginationContainer.style.display = 'flex';
    
    // Generate news cards
    const newsHTML = newsToDisplay.map(news => {
        const newsDate = new Date(news.published_at);
        const day = newsDate.getDate();
        const month = newsDate.toLocaleDateString('id-ID', { month: 'short' });
        const categoryColors = {
            'produk': '#667eea',
            'kesehatan': '#28a745',
            'perusahaan': '#dc2626',
            'umum': '#3b82f6'
        };
        const categoryColor = categoryColors[news.category] || '#3b82f6';
        
        const newsDetailUrl = `news-detail.html?slug=${news.slug}`;
        
        return `
            <article class="news-card">
                <a href="${newsDetailUrl}" class="news-card-link" style="text-decoration: none; color: inherit; display: block;">
                    <div class="news-image">
                        <div class="news-image-placeholder" style="background: linear-gradient(135deg, ${categoryColor} 0%, ${categoryColor}dd 100%);">
                        </div>
                        <div class="news-date">
                            <span class="date-day">${day}</span>
                            <span class="date-month">${month}</span>
                        </div>
                    </div>
                    <div class="news-content">
                        <div class="news-category">${news.category ? news.category.charAt(0).toUpperCase() + news.category.slice(1) : 'Berita'}</div>
                        <h3>${news.title}</h3>
                        <p>${news.excerpt}</p>
                        <span class="read-more">
                            Baca Selengkapnya <i class="fas fa-arrow-right"></i>
                        </span>
                    </div>
                </a>
            </article>
        `;
    }).join('');
    
    newsGrid.innerHTML = newsHTML;
    
    // Update pagination
    updateNewsPagination(totalPages);
    updateNewsPaginationInfo(filteredNews.length, startIndex + 1, Math.min(endIndex, filteredNews.length));
}

// Update news pagination
function updateNewsPagination(totalPages) {
    const pagination = document.getElementById('pagination');
    if (!pagination) return;
    
    if (totalPages <= 1) {
        pagination.innerHTML = '';
        return;
    }
    
    let paginationHTML = '';
    
    // Previous button
    paginationHTML += `
        <button class="pagination-btn ${currentNewsPage === 1 ? 'disabled' : ''}" 
                onclick="goToNewsPage(${currentNewsPage - 1})" 
                ${currentNewsPage === 1 ? 'disabled' : ''}>
            <i class="fas fa-chevron-left"></i> Sebelumnya
        </button>
    `;
    
    // Page numbers
    const maxVisiblePages = 5;
    let startPage = Math.max(1, currentNewsPage - Math.floor(maxVisiblePages / 2));
    let endPage = Math.min(totalPages, startPage + maxVisiblePages - 1);
    
    if (endPage - startPage + 1 < maxVisiblePages) {
        startPage = Math.max(1, endPage - maxVisiblePages + 1);
    }
    
    // First page and ellipsis
    if (startPage > 1) {
        paginationHTML += `<button class="pagination-btn" onclick="goToNewsPage(1)">1</button>`;
        if (startPage > 2) {
            paginationHTML += `<span class="pagination-ellipsis">...</span>`;
        }
    }
    
    // Page numbers
    for (let i = startPage; i <= endPage; i++) {
        paginationHTML += `
            <button class="pagination-btn ${i === currentNewsPage ? 'active' : ''}" 
                    onclick="goToNewsPage(${i})">
                ${i}
            </button>
        `;
    }
    
    // Last page and ellipsis
    if (endPage < totalPages) {
        if (endPage < totalPages - 1) {
            paginationHTML += `<span class="pagination-ellipsis">...</span>`;
        }
        paginationHTML += `<button class="pagination-btn" onclick="goToNewsPage(${totalPages})">${totalPages}</button>`;
    }
    
    // Next button
    paginationHTML += `
        <button class="pagination-btn ${currentNewsPage === totalPages ? 'disabled' : ''}" 
                onclick="goToNewsPage(${currentNewsPage + 1})" 
                ${currentNewsPage === totalPages ? 'disabled' : ''}>
            Selanjutnya <i class="fas fa-chevron-right"></i>
        </button>
    `;
    
    pagination.innerHTML = paginationHTML;
}

// Go to news page
function goToNewsPage(page) {
    const totalPages = Math.ceil(filteredNews.length / newsPerPage);
    if (page >= 1 && page <= totalPages) {
        currentNewsPage = page;
        loadNews();
        
        // Scroll to top of news section
        const newsSection = document.getElementById('news');
        if (newsSection) {
            newsSection.scrollIntoView({ 
                behavior: 'smooth', 
                block: 'start' 
            });
        }
    }
}

// Update news pagination info
function updateNewsPaginationInfo(totalNews, startItem, endItem) {
    const paginationInfo = document.getElementById('paginationInfo');
    if (paginationInfo) {
        paginationInfo.textContent = `Menampilkan ${startItem}-${endItem} dari ${totalNews} berita`;
    }
}

// Initialize news on page load
document.addEventListener('DOMContentLoaded', function() {
    if (document.querySelector('.news-grid')) {
        loadNews();
    }
});

// Console welcome message
console.log('%cPT Nellco Indopharma', 'color: #2c5aa0; font-size: 20px; font-weight: bold;');
console.log('%cSolusi Kesehatan Terpercaya', 'color: #666; font-size: 14px;');
console.log('%cWebsite ini dibuat dengan ❤️ untuk kesehatan masyarakat Indonesia', 'color: #2c5aa0; font-size: 12px;');